<template>
  <div class="title">
    欢迎登录
  </div>
 
  <van-form @submit="handleLogin">
    <van-cell-group inset>
      <van-field
        v-model="loginForm.phone"
        name="账号"
        label-width="auto"
        label="账号"
        placeholder="账号"
        :rules="[{ required: true, message: '请填写账号' }]"
      />
      <van-field
        v-model="loginForm.password"
        type="password"
        name="密码"
        label-width="auto"
        label="密码"
        placeholder="密码"
        :rules="[{ required: true, message: '请填写密码' }]"
      />
    </van-cell-group>
    <div style="margin: 16px;">
      <van-button block type="primary" native-type="submit">
        提交
      </van-button>
    </div>
  </van-form>
 
</template>


<script setup lang="ts">

  import { ref,reactive } from 'vue';
  import { useRouter } from 'vue-router';
  import {login} from "@/api/customer"

  const router = useRouter();

  const loginForm = reactive({
    "phone":"110",
    "password":"123456"
  });

  const handleLogin = ()=>{
    login(loginForm).then((resp)=>{

      if(resp.code == 200){
        // 成功通知
        showNotify({ type: 'success', message: '登录成功' });

        let customerInfo = resp.data.customerInfo;

        sessionStorage.setItem("token",resp.data.token);
        sessionStorage.setItem("customerInfo",JSON.stringify(customerInfo));

        router.replace({"path":"/home/index"});

      }else{
        showNotify({ message: resp.msg });
      }
    })
  }
</script>

<style scoped>
  .title{
    padding: 40px 0px;
    text-align: center;
    font-size: 20px;
  }
</style>

 